import React from "react";
import {useHistory} from 'react-router-dom'
import { Form, Input, Button,message } from "antd";
import axios from "axios";

export default function Personal() {
  const history = useHistory()
  const onFinish = (values) => {

    // let math = Math.random()
    // let value = {id:math, ...values}

    axios({
      headers: {
        "Content-Type": "application/json",
      },
      method: "post",
      url: "http://localhost:3004/Login",
      data: values,
      onUploadProgress: ({ total, loaded }) => {},
    }).then((res) => {
      console.log("text", res.status, res, res === res.status);
      // eslint-disable-next-line no-mixed-operators
      if ((res && res.status === 200) || 201) {
        // 响应成功的回调
        message.success("上传成功");
      } else {
        // 响应失败
        message.error("上传失败");
      }
    });
  };

  const onFinishFailed = (errorInfo) => {
    console.log("Failed:", errorInfo);
  };

  return (
    <div>
      <Form
        name="basic"
        labelCol={{
          span: 8,
        }}
        wrapperCol={{
          span: 16,
        }}
        initialValues={{
          remember: true,
        }}
        onFinish={onFinish}
        onFinishFailed={onFinishFailed}
        autoComplete="off"
      >
        <Form.Item
          label="Username"
          name="username"
          rules={[
            {
              required: true,
              message: "账号最少四位",
              pattern: new RegExp(/^[\\u4e00-\\u9fa5_a-zA-Z0-9-]{4,16}$/),
            },
          ]}
        >
          <Input/>
        </Form.Item>

        <Form.Item
          label="Password"
          name="password"
          rules={[
            {
              required: true,
              message: "密码必须包含数字和字母,且在6-18位之间",
              pattern: new RegExp(/^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,16}$/),
            },
          ]}
        >
          <Input.Password />
        </Form.Item>

        <Form.Item
          wrapperCol={{
            offset: 8,
            span: 16,
          }}
        >
          <Button type="primary" htmlType="submit">
            Submit
          </Button>
        </Form.Item>
      </Form>
    </div>
  );
}
